<template>
<div>
    <!-- 分成3个组件 -->
    <!-- 1，搜索头组件search-top -->
    <SearchTop></SearchTop>
    <!-- 2，搜索框组件search-body -->
    <SearchBody></SearchBody>
    <!-- 3，搜索热门词组件hot-word -->
    <HotWord v-show=' isShow '></HotWord>
    <!-- 4,输入内容后的联想词展示区域 -->
    <WordWrap v-show=' !isShow '></WordWrap>
</div>
</template>

<script>
import SearchTop from '../../components/search/SearchTop'
import SearchBody from '../../components/search/SearchBody'
import HotWord from '../../components/search/HotWord'
import WordWrap from '../../components/search/WordWrap'
import {mapState} from 'vuex'
export default {

    data () {
        return {
        }
    },
    computed:{
        ...mapState('search', ['isShow'])
    },
    components:{
        SearchTop,
        SearchBody,
        HotWord,
        WordWrap,
    },
    mounted () {

    },
    created() {
    //底部栏消失
    this.$store.dispatch("footer/footernav", false);
  },
  beforeDestroy() {
    //销毁
    this.$store.dispatch("footer/footernav", true);
  },
}
</script>

<style scoped>

</style>
